<include file="Public/header"/>
<body class="body-bg">
<div class="park-header">
    <div class="park-header__title">
        意见反馈
    </div>
    <div class="park-header__left park-back"><i class="iconfont icon-fanhui"></i></div>
</div>
<div class="container">
    <form onsubmit="return sub_form();">
        <div class="park-opinion-textarea">
            <textarea name="contents" id="contents" placeholder="请输入您的宝贵意见，我们将第一时间关注，不断优化改进..."></textarea>
            <div class="park-opinion-images">
                <ul id="form_list">
                    <li>
                        <label class="park-file">
                            <input id="file" type="file" accept="image/png, image/jpeg, image/jpg, image/gif" name="">
                            <i class="iconfont icon-jiahao"></i>
                        </label>
                    </li>
                </ul>
            </div>
        </div>
        <div class="park-opinion-tel">
            <div class="park-opinion-tel__title">您的联系方式（选填）</div>
            <div class="park-opinion-tel__input">
                <input type="text" placeholder="" name="name" id="name">
            </div>
        </div>
        <button type="submit" class="park-btn park-btn-default park-btn-bottom mt-footer__btn">确认提交</button>
    </form>
</div>
<script src="__ROOT__/Public/Home/layer/layer.js"></script>
<script>
    $(function () {
        var Opinion = {
            images: [],
            delImages: function (ind) {
                this.images.splice(ind, 1);
            },
            appendHideInput: function () {}
        };

        $(document).on('change', '#file', function (ev) {
            var file = this.files[0];
            PARK.getBase64(file, prependImage);
            var url = '/Home/User/feedback/';
            PARK.ajaxFileData(url, 'post', file, function (res) {
                var res = JSON.parse(res);
                $('#form_list li:first-child').append('<input type="hidden" name="images[]" class="img" value="'+res.result+'">');
            });
        });

        $(document).on('click', '.park-opinion-images .del', function () {
            var li = $(this).parents('li');
            li.remove();
        });

        function prependImage (imgSrc) {
            var img = $('<div class="image"></div>').css('backgroundImage', 'url('+imgSrc+')');
            img.append('<div class="del"> <i class="iconfont icon-del"></i> </div>');
            var li = $('<li></li>').append(img);
            $('.park-opinion-images ul').prepend(li);
        }

        $('form').submit(function (ev) {
            //return false;
        });
    });
    function sub_form(){
        var contents = $('#contents').val();
        if(!contents){
            layer.open({
                content:'请输入您的宝贵意见'
                ,skin: 'msg'
                ,time: 2 //2秒后自动关闭
            });
            return false;
        }
        var name = $('#name').val();
        window.img_url = '';
        $('#form_list .img').each(function(){
            window.img_url = $(this).val()+',';
        });
        $.post('/Home/User/feedback/',{contents:contents,name:name,images:img_url},function(data){
            layer.open({
                content: data.msg
                ,btn: ['确定']
                ,yes: function(index){
                    window.location = '/Home/User/setting/';
                }
            });
        },'json');
        return false;
    }
</script>
</body>
</html>